<%@ page contentType="text/html; charset=UTF-8" language="java" %>

<html>
<head>

    <title>改密码</title>
    <meta charset="UTF-8">
   <title>改密码页面</title>
<link href="../css/Utils.css" rel="stylesheet" type="text/css" />
<link href="../css/List.css" rel="stylesheet" type="text/css" />
    
    <style type="text/css">
        span {
            color: red;
            font-size: 12px;
        }
    </style>
    <script type="text/javascript">
        window.onload = function () {
            //密码和确认密码一致
            //获取password2的span标签
            var password2ErrorSpan = document.getElementById("passwordError");
            //给确认密码文本框绑定blur事件,失去焦点验证
            var password2Elt = document.getElementById("newPassword2");
            password2Elt.onblur = function () {
                var password1 = document.getElementById("newPassword1").value;
                var password2 = document.getElementById("newPassword2").value;
                var password2RegExp = /^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)[^]{8,16}$/;
                if(password2.length == 0){
                    password2ErrorSpan.innerText = "密码不能为空"
                } else if(password2 != password1){
                    password2ErrorSpan.innerText = "密码和确认密码不一致"
                } else if (!password2RegExp.test(password2)){
                    password2ErrorSpan.innerText = "密码至少由8-16个字符，至少1个大写字母，1个小写字母和1个数字";
                }
            }
            //给确认密码文本框绑定focus事件
            password2Elt.onfocus = function () {
                password2ErrorSpan.innerText = "";
            }

            //最终表单中所有项均合法方可提交
            //给提交按钮绑定鼠标单击事件
            var submitBtnElt = document.getElementById("submitBtn");
            submitBtnElt.onclick = function () {
                //触发username的blur事件
                password2Elt.focus();
                password2Elt.blur();
                //当所有表单项都合法的时候，提交表单
                if (password2ErrorSpan.innerText == ""){
                    //获取表单对象
                    var userFormElt = document.getElementById("userForm");
                    //提交表单
                    userFormElt.submit();
                }
            }
        }
  
    </script>
</head>
<body>
<!-- 头部 -->
<div class="header"><br>
<nerong>&nbsp;&nbsp;更改密码页面&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;</nerong>
<a bgc>退出登录</a>
</div>
</div><br>


<th>

</tr>

    <div class="body">  
    <form id = "userForm" action="../UserUpPwServlet" method="post">
        新密码：<br><input type="password" name="newPassword1" id="newPassword1">
                <span style="color: gray;font-size: 12px">* 至少8-16个字符，至少1个大写字母，1个小写字母和1个数字!</span><br>
        确认新密码：<br><input type="password" name="newPassword2" id="newPassword2">
                <span id="passwordError"></span><br>
        <input type="button" value="保存" id="submitBtn">
        <input type="reset" value="重置">
    </form>
    </div>
    <br>
    <hr>
</body>
</html>
